<!DOCTYPE html>
<html lang="en">

<head>

  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>组织架构</title>
    <style>
      * {
        margin: 0;
        padding: 0;
      }

      html,
      body {
        height: 100%;
        width: 100%;
        overflow: hidden;
      }

      .wrapper {
        height: calc(100% - 70px);
      }

      .zoom {
        padding: 10px;
        border-radius: 12px;
        background-color: #FFFFFF;
        border: none;
        color: #4E5969;
        font-size: 14px;
        margin: 0 5px;
      }


      .butt {
        padding: 8px 16px;
        border-radius: 24px;
        background-color: #FFFFFF;
        border: none;
        color: #2E2E3A;
        font-size: 14px;
        cursor: pointer;
      }

      .butted {
        padding: 8px 16px;
        border-radius: 24px;
        background-color: #FFFFFF;
        border: none;
        font-size: 14px;
        cursor: pointer;
        background: #165DFF;
        color: #FFFFFF;
      }

      button:hover {
        background: #165DFF;
        color: #FFFFFF;
      }

      #myDiagramDiv1 {
        width: 100%;
        height: 90%;
      }
    </style>
    <link rel="stylesheet" type="text/css" href="assets/css/comm.css" />
	<link rel="stylesheet" type="text/css" href="assets/css/business.css" />
	<link rel="stylesheet" type="text/css" href="assets/js/src/css/layui.css" />
    <link rel="stylesheet" type="text/css" href="assets/css/navigation.css" />
	<link rel="stylesheet" type="text/css" href="assets/css/implementation-rate.css"/>
    <link rel="stylesheet" type="text/css" href="assets/css/style.css" />
    <link rel="stylesheet" type="text/css" href="assets/css/mask.css" />
  </head>
</head>


<body>
  <script src="assets/js/src/layui.js"></script>
  <!-- <script src="assets/js/go.js"></script> -->

  <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.min.js"></script> -->
  <div class="container">
    <div class="navigation before">

    </div>
    <div class="content">
      <header class="">
        <div class="left">
          <h1>预算执行</h1>
        </div>
        <div class="right">
          <div class="search">
            <div class="year">
              <p>时间：</p>
              <input type="text" name="" id="year" value="" />
            </div>
            <div class="section">
              <p>部门：</p>
              <div class="sector">
                <div class="">
                  <span>全所</span>
                </div>
              </div>
              <div class="options">
                <div class="all">
                  <i></i>
                  <p>全所</p>
                </div>
              </div>
            </div>
          </div>
          <time></time>
          <div class="menu">
            <a class="goBack" href="javascript:goFront()">前往后台</a>
            <div class="user">
              <p>A</p>
              <div class="">
                <a href="">修改密码</a>
                <a href="login.html">退出登录</a>
              </div>
            </div>
          </div>
        </div>
      </header>
      <!-- 内容区域 -->
      <div class="wrapper" id="wrapper" style="position: relative;">
        <h3 style="height: 8%;">支出概览</h3>
        <!-- 树形结构 -->
        <div id="myDiagramDiv1" style="position:absolute; top:0px; left:0px; width:0px; height:0px; opacity:0"></div>
        <!-- 环形图 -->
        <span id="myCanvases" style="position:absolute; top:0px; left:0px; width:0px; height:0px; opacity:0"></span>
        <!-- 进度条形图 -->
        <span id="myCanvases-process" style="position:absolute; top:0px; left:0px; width:0px; height:0px; opacity:0">
          <p id="pro">条形图</p>
        </span>

        <!-- 缩放按钮 -->
        <div style="position: absolute;top: 30px;right: 20px; display: flex;">
          <p>
            <!-- <div id="zoomToFit" class="zoom">缩放以适应</div> -->
            <!-- <div id="centerRoot" class="zoom">以根为中心</div> -->
            <div id="zoomOut" class="zoom" onclick="zoomOut()"><img src="assets/images/index/icon_zoom out.png" alt="">
            </div>
          </p>
        </div>
        <!-- tab切换按钮 -->
        <div class="tabs" style="position: absolute;top: 20px;left: 130px;">
          <button id="one" class="butt" xh="1">业务板块</button>
          <button id="two" class="butt" xh="2">部门维度</button>
        </div>
        <div id="nodata"></div>
      </div>
    </div>
  </div>
  <!-- <div class="mask-wrap"></div> -->
  <div id="rateMask" class="mask-wrap">
  	<div class="mask-position">
  		<div class="mask-content">
  			<div class="mask-title">
  				<h4>执行率说明</h4>
				<img src="assets/images/mask/close.png" >
  			</div>
			<div class="mask-scroll">
				<div class="left box">
					
				</div>
				<div class="box month">
					<div class="headline">
						<h3>月度累计预算执行</h3>
					</div>
					<div id="monthlj"></div>
				</div>
				<div class="box state">
					<div class="">
						<h4>执行率说明</h4>
						<div class="edit">
							<img src="assets/images/capital/edit.svg" >
							<span>编辑</span>
						</div>
					</div>
					<p></p>
				</div>
			</div>
  		</div>
  	</div>
  </div>
  <div id="editMask" class="mask-wrap">
  	<div class="mask-position">
  		<div class="mask-content">
  			<div class="mask-title">
  				<h4>填写执行率说明</h4>
  				<img src="assets/images/mask/close.png" >
  			</div>
  			<div class="mask-write-area">
  				<p>执行率说明</p>
				<textarea placeholder="请输入"></textarea>
  			</div>
			<div class="btn">
				<button class="cancle">取消</button>
				<button class="save">保存</button>
			</div>
  		</div>
  	</div>
  </div>
</body>
<script src="assets/js/chart-bundle.js"></script>
<script src=" assets/js/jquery.min.js"></script>

<script src="assets/js/test.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/mask.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/org.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/navigation.js"></script>
<script src="assets/js/http/api.js"></script>
<script src="assets/plugins/echarts.min.js"></script>
<script src="assets/plugins/chartlib.js"></script>
<script src="assets/js/implementation-rate.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/businessSegment.js"></script>
<script src="assets/plugins/comm.js" type="text/javascript" charset="utf-8"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> -->
<script src="assets/js/go.js"></script>

<script>
  $(function () {
    zuzhijiagou = 1;
    yewuTreeData(xh); //获取数据
  });
</script>


</html>